<template>
    <div>
        <div class="config">
            <div class="back" onclick="window.history.go(-1)"><img src="../assets/images/back.png" alt=""></div>
            <p>分享邀请</p>
        </div>
        <div class="con">
            <p v-show="show">复制以下链接进行分享注册</p>
            <p style="font-size:12px" id="taokouling">{{link}}</p>
            <button v-show="show" class="btn" data-clipboard-target="#taokouling" data-clipboard-action="copy" id="copyCode">复制链接</button>
        </div>
    </div>
</template>

<script>
import "../assets/clipboard.min.js"
export default {
    name: "index",
    data() {
        return {
            level: "",
            link: "",
            show: true
        };
    },
    beforeCreate() {
        document.getElementsByTagName("body")[0].style.background = "#fff";
    },
    mounted() {
        // 获取分享等级
        var name = localStorage.getItem("name");
        var uid = localStorage.getItem("uid");
        var math = Math.floor(Math.random() * 1000000000);
        this.level = this.$route.params.level;

        if (this.level == undefined) {
            this.link = "该链接已失效，请重新分享";
            this.show = false;
        } else {
            this.link =
                "http://jm.lingfeng.me/dist/#/register?level=" +
                this.level +
                "&higher_up=" +
                uid +
                "&math=" +
                math;
        }

        var clipboard = new Clipboard(".btn");
        clipboard.on("success", function(e) {
            
            document.getElementById("copyCode").innerHTML = "复制成功";
        });
        clipboard.on("error", function(e) {
            document.getElementById("copyCode").innerHTML =
                "复制失败，请长按复制链接";
        });

        /*
        if (this.level == "1") {
            wx.onMenuShareAppMessage({
                title: name + "邀请您成为镜面集团联合创始人", // 分享标题
                desc: "点击进入注册您的个人信息", // 分享描述
                link:
                    "http://jm.lingfeng.me/dist/#/register?level=" +
                    this.level +
                    "&higher_up=" +
                    uid +
                    "&math=" +
                    math, // 分享链接
                imgUrl: "", // 分享图标
                type: "", // 分享类型,music、video或link，不填默认为link
                dataUrl: "", // 如果type是music或video，则要提供数据链接，默认为空
                success: function() {
                    // 用户确认分享后执行的回调函数
                },
                cancel: function() {
                    // 用户取消分享后执行的回调函数
                }
            });
        } else if (this.level == "2") {
            wx.onMenuShareAppMessage({
                title: name + "邀请您成为镜面集团执行董事", // 分享标题
                desc: "点击进入注册您的个人信息", // 分享描述
                link:
                    "http://jm.lingfeng.me/dist/#/register?level=" +
                    this.level +
                    "&higher_up=" +
                    uid +
                    "&math=" +
                    math, // 分享链接
                imgUrl: "", // 分享图标
                type: "", // 分享类型,music、video或link，不填默认为link
                dataUrl: "", // 如果type是music或video，则要提供数据链接，默认为空
                success: function() {
                    // 用户确认分享后执行的回调函数
                },
                cancel: function() {
                    // 用户取消分享后执行的回调函数
                }
            });
        } else if (this.level == "3") {
            wx.onMenuShareAppMessage({
                title: name + "邀请您成为镜面集团合伙人", // 分享标题
                desc: "点击进入注册您的个人信息", // 分享描述
                link:
                    "http://jm.lingfeng.me/dist/#/register?level=" +
                    this.level +
                    "&higher_up=" +
                    uid +
                    "&math=" +
                    math, // 分享链接
                imgUrl: "", // 分享图标
                type: "", // 分享类型,music、video或link，不填默认为link
                dataUrl: "", // 如果type是music或video，则要提供数据链接，默认为空
                success: function() {
                    // 用户确认分享后执行的回调函数
                },
                cancel: function() {
                    // 用户取消分享后执行的回调函数
                }
            });
        }

        // 微信分享
        var qsW = require("qs");
        this.axios({
            method: "post",
            url: `${this.siteUrl}/getSignature`,
            data: qsW.stringify({
                url: location.host + location.pathname
            })
        })
            .then(response => {
                wx.config({
                    debug: false,
                    appId: response.data.data.appId,
                    timestamp: response.data.data.timestamp,
                    nonceStr: response.data.data.noncestr,
                    signature: response.data.data.signature,
                    jsApiList: ["onMenuShareAppMessage"]
                });
            })
            .catch(err => {
                console.log(err);
            });
              */
    }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.con p {
    font-size: 20px;
    margin-left: 5px;
    margin-top: 5px;
}
.con button {
    background: #5aa0c8;
    color: #fff;
    margin-left: 5px;
    margin-top: 5px;
    width: 150px;
    text-align: center;
    border: none;
    height: 30px;
    line-height: 30px;
    border-radius: 20px;
    outline: none;
}
</style>
